"use strict";

import {
    //核心
    React, Enhance, Controller, $,
    tools,
    // 组件
    Table, TabPage, Lang, Dialog, Tree,
    Form, Page, Upload, Icon, Grid, Panel,
    Input, BoxWidget, Button, Lock, Directive,Http
} from 'admin';


var {http} = tools;
import valid from '../../validate/admin.json';

class FeedbackController extends Controller {
    state = {
        tableProps: null,
        // sex: [
        //     {title: '女', value: 0},
        //     {title: '男', value: 1}
        // ],
        // edit: {}

        tableMessageClient:null,

        tableMessageServer:null,

        data:{},

        user:{}
    }

    constructor() {
        super();

        this.state.tableProps = {
            update: {},
            query: {},
            onRowClick: (data)=>{
                this.refs.table1.query({account:data.account});
                this.refs.table2.query({account:data.account});
                this.setState({data})
            },
            // types: {
            //     state: function (data, options) {
            //         // debugger;
            //         if (data.val == 1)
            //             return <span className='label bg-red'>男</span>;
            //         if (data.val == 0)
            //             return <span className='label bg-green'>女</span>;
            //
            //     }
            // },
            // buttons: {
            //     edit: {
            //         onClick: this._handlerEditDialog
            //     },
            //     upload: this._handlerCreateUpload,
            //     'delete': {
            //         onClick: this._handlerDeleteDialog
            //     }
            // },
            pk: 'id',
            fields: [
                {
                    order: 0,
                    name: 'name',
                }
            ]
        };
        this.state.tableMessageClient = {
            action:"message_client",
            update: {},
            query: {},
            // types: {
            //     state: function (data, options) {
            //         // debugger;
            //         if (data.val == 1)
            //             return <span className='label bg-red'>男</span>;
            //         if (data.val == 0)
            //             return <span className='label bg-green'>女</span>;
            //
            //     }
            // },
            // buttons: {
            //     edit: {
            //         onClick: this._handlerEditDialog
            //     },
            //     upload: this._handlerCreateUpload,
            //     'delete': {
            //         onClick: this._handlerDeleteDialog
            //     }
            // },
            pk: 'id',
            fields: [
                {
                    order: 0,
                    name: 'message',
                },
                {
                    order: 0,
                    name: 'time',
                    type:{name:'datetime'}
                }
            ]
        };
        this.state.tableMessageServer = {
            action:"message_server",
            update: {},
            query: {},
            // types: {
            //     state: function (data, options) {
            //         // debugger;
            //         if (data.val == 1)
            //             return <span className='label bg-red'>男</span>;
            //         if (data.val == 0)
            //             return <span className='label bg-green'>女</span>;
            //
            //     }
            // },
            // buttons: {
            //     edit: {
            //         onClick: this._handlerEditDialog
            //     },
            //     upload: this._handlerCreateUpload,
            //     'delete': {
            //         onClick: this._handlerDeleteDialog
            //     }
            // },
            pk: 'id',
            fields: [
                {
                    order: 0,
                    name: 'message',
                },
                {
                    order: 0,
                    name: 'time',
                    type:{name:'datetime'}
                }
            ]
        };
    }
    componentDidMount() {
        this.refs.http
            .send(`${window.SERVER_URL}/${this.props.module}/feedback/get_account`)
            .success(this.get_account.bind(this))
    }

    get_account(data){
        this.setState({data})
    }
    render() {
        var {data} = this.state;
        return (
            <Grid>
                <Http ref="http"/>
                <Grid col="12 12 2 2">
                    <BoxWidget color="1">
                        <Lock>
                            <Table ref="table" {...this.props} {...this.state.tableProps}></Table>
                        </Lock>
                    </BoxWidget>
                </Grid>
                <Grid col="12 12 10 10">
                    <BoxWidget color="3" buttons={[{icon:'add',title:'回复',onClick:this._handlerAddDialog}]}>
                        <Lock>
                            <Table ref="table1" height={200} {...this.props} {...this.state.tableMessageClient} ></Table>
                        </Lock>
                    </BoxWidget>
                    <BoxWidget color="3">
                        <Lock>
                            <Table ref="table2" height={200} {...this.props} {...this.state.tableMessageServer} ></Table>
                        </Lock>
                    </BoxWidget>
                </Grid>

                <Directive name="Modal">
                    <Dialog
                        ref="addDialog"
                        elem={Form}
                        {...this.props}
                        action="do_add"
                        title={this._lang("reply")}
                        onSuccess={this._handlerAddSuccess}
                        rules={valid[this.props.controller].do_add}
                        buttons={[{title:'submit',type:'submit'}]}
                    >
                        <Input type="hidden"  name="name" value={data.name} />
                        <Input type="hidden" name="account" value={data.account} />
                        <Input type="text" name="message" message={this._lang('message_cont')}/>
                    </Dialog>
                </Directive>
            </Grid>
        );
    }

    /**
     *
     * @private
     */
    _handlerAddDialog(user) {
        // this.setState({user}, function () {
            this.refs.addDialog.show();
        // })
    }

    /**
     *
     * @param edit
     * @private
     */
    _handlerEditDialog(edit) {
        this.setState({edit}, (function () {
            this.refs.editDialog.show();
        }).bind(this));
    }

    _handlerEditSuccess(data) {
        if (data) {
            this.refs.table.update(data);
            this.refs.editDialog.hide();
        }
    }

    /**
     *
     * @private
     */
    _handlerAddSuccess(data) {
        if (data) {
            this.refs.table2.append(data);
            this.refs.addDialog.hide();
        }
    }

    /**
     *
     * @param key
     * @param data
     * @param index
     * @returns {XML}
     * @private
     */
    _handlerCreateUpload(key, data, index) {
        return (
            <Upload
                url={window.SERVER_URL+"/scdc/upload/get_header"}
                onSuccess={this._handlerUploadSuccess}
                post={{id:data.id}}
            ><Icon icon="upload" type="admin"></Icon>
            </Upload>
        );
    }

    /**
     *
     * @param data
     * @private
     */
    _handlerUploadSuccess(data) {
        this.refs.table.update(data);
    }


    /**
     *
     * @param data
     * @returns {boolean}
     * @private
     */
    _handlerSearch(data) {
        this.refs.table.query(data);
        return false;
    }

    /**
     *
     * @param delete
     * @private
     */
    _handlerDeleteDialog(edit) {
        this.setState({edit}, (function () {
            this.refs.deleteDialog.show();
        }).bind(this));
    }

    /**
     *
     * @param data
     * @private
     */
    _handlerDeleteSuccess(data) {
        if (data) {
            this.refs.table.refresh(data);
            this.refs.deleteDialog.hide();
            window.toast(<Lang lang="message.success.delete"/>);
        } else {
            window.toast(<Lang lang="message.error.delete"/>);
        }
    }
}

export default Enhance(FeedbackController);